<template lang="pug">
el-dialog(
  title="回复评论"
  :visible.sync="show"
  @open="beforeOpen"
  width="483px"
  :before-close="handleClose"
  :close-on-click-modal="false"
)
  .model-body
    el-input(:placeholder="`回复${currentItem.fromUser}的评论`" v-model="commentContext")
  .modal-footer(slot="footer")
    el-button(@click="handleClose") 取消
    el-button(type="primary" @click="confirm") 确定
</template>

<script>
import { postAddComment } from 'api'
export default {
  name: 'commentModal',
  props: {
    show: Boolean,
    currentItem: Object,
    materialId: [Number, String]
  },
  data () {
    return {
      commentContext: ''
    }
  },
  methods: {
    beforeOpen () {
      this.commentContext = ''
    },
    handleClose () {
      this.$emit('close')
    },
    async confirm () {
      try {
        if (!this.commentContext) {
          this.$message.error('请先输入要回复的内容！')
          return
        }
        await this.$axios.post(postAddComment, { content: { findMaterialId: this.materialId, commentContext: this.commentContext, parentId: this.currentItem.id } } )
        this.$message.success('回复成功！')
        this.$emit('success')
      } catch (err) {
        console.log(err)
        this.$message.error(err.message || err.ResultSet.errors)
      }
    }
  }
} 
</script>

<style lang="scss" scoped>
</style>
